<template>
    <view style="padding: 5px">
        <u-button style="margin-top: 5px;" type="primary" :text="stateBtn.text" :disabled="stateBtn.disabled"
                  @click="searchDevices()"></u-button>
        <view style="margin-top: 20%">
            <view class="ver-layout-center" v-if="stateInfo.success === 'success'">
                已通过蓝牙充值成功
                <view>当前该电表的剩余金额为{{ stateInfo.syje }}元</view>
            </view>
            <view class="ver-layout-center" v-else-if="stateInfo.success === 'error'">
                蓝牙充值失败
                <view>{{ stateInfo.sbyy }}</view>
            </view>
            <view class="ver-layout-center" v-else>
                <view>
                    正在充值第
                    <text style="color: red">{{ stateInfo.chargeValue }}</text>
                    条记录， 共{{ stateInfo.chargeListLength }}条
                </view>
                <view>
                    第
                    <text style="color: red">{{ stateInfo.proValue }}</text>
                    步执行中，共7步
                </view>
            </view>
        </view>
    </view>
</template>

<script>
import {BluePlus} from "./blue-plus.js"

let engine;
export default {
  name: "plus",
  data() {
    return {
      stateBtn: {text: "搜索蓝牙设备"},
      stateInfo: {}
    }
  },
  onLoad() {
    engine = new BluePlus(this.stateInfo)
  },
  methods: {
    searchDevices() {
      engine.startBluetoothDiscovery()
    }
  }
}
</script>

<style scoped>

</style>
